/**
 * 一个可以记录选择状态的dropdown
 */
import { Dropdown, DropdownProps } from 'antd'
import { MouseEventHandler, useEffect, useState } from 'react'

interface IDropdownProps extends DropdownProps {
  onClick?: MouseEventHandler<HTMLElement>
  value?: string
}

export default function HDropdown(props: IDropdownProps) {
  const [showName, setShowName] = useState('')

  useEffect(() => {
    const node = props?.menu?.items?.find((item) => item?.key == props.value)
    if (node) {
      //@ts-ignore
      setShowName(node.label)
    }
  }, [props?.menu?.items, props.value])
  return (
    <Dropdown.Button {...props} menu={props.menu} size="small" className={props?.className}>
      {showName}
    </Dropdown.Button>
  )
}
